<template>
    <mi-form-page @submit="submit"
                  :loading="edit.loading"
                  v-model:show="edit.show"
                  title="上传配置"
    >
        <el-form :model="edit.info"
                 :rules="rules"
                 ref="formRef">

            <el-form-item prop="driver" label="上传驱动">
                <mi-radio v-model="edit.info.value.driver" :options="drivers"/>
            </el-form-item>

            <template v-if="edit.info.value.driver == 'qiniu'">
                <el-form-item prop="" label="backet">
                    <mi-input v-model="edit.info.value.qiniu.bucket" placeholder="存储空间" />
                </el-form-item>
                <el-form-item prop="access_key" label="access_key">
                    <mi-input v-model="edit.info.value.qiniu.access_key" />
                </el-form-item>
                <el-form-item prop="secret_key" label="secret_key">
                    <mi-input v-model="edit.info.value.secret_key" />
                </el-form-item>
                <el-form-item prop="domain" label="domain">
                    <mi-input v-model="edit.info.value.domain" placeholder="空间域名" />
                </el-form-item>
            </template>

            <template v-if="edit.info.value.driver == 'ali'">
                <el-form-item prop="" label="bucket">
                    <mi-input v-model="edit.info.value.ali.bucket" placeholder="存储空间" />
                </el-form-item>
                <el-form-item prop="access_id" label="access_id">
                    <mi-input v-model="edit.info.value.ali.access_id" />
                </el-form-item>
                <el-form-item prop="access_secret" label="access_secret">
                    <mi-input v-model="edit.info.value.ali.access_secret" />
                </el-form-item>
                <el-form-item prop="domain" label="domain">
                    <mi-input v-model="edit.info.value.ali.domain" placeholder="空间域名" />
                </el-form-item>
                <el-form-item prop="region" label="endpoint">
                    <mi-input v-model="edit.info.value.endpoint" placeholder="所属地域" />
                </el-form-item>

            </template>

            <template v-if="edit.info.value.driver == 'qcloud'">
                <el-form-item prop="" label="bucket">
                    <mi-input v-model="edit.info.value.qcloud.bucket" placeholder="存储空间" />
                </el-form-item>
                <el-form-item prop="secret_id" label="secret_id">
                    <mi-input v-model="edit.info.value.qcloud.secret_id" />
                </el-form-item>
                <el-form-item prop="secret_key" label="secret_key">
                    <mi-input v-model="edit.info.value.qcloud.secret_key" />
                </el-form-item>
                <el-form-item prop="domain" label="domain">
                    <mi-input v-model="edit.info.value.qcloud.domain" placeholder="空间域名" />
                </el-form-item>
                <el-form-item prop="region" label="region">
                    <mi-input v-model="edit.info.value.qcloud.region" placeholder="所属地域" />
                </el-form-item>
            </template>

            <el-form-item prop="file_size" label="上传文件大小">
                <mi-input-number v-model="edit.info.value.file_size" />
                <mi-form-aux>不限大小请填0</mi-form-aux>
            </el-form-item>

            <el-form-item prop="file_ext" label="上传文件格式">
                <mi-input v-model="edit.info.value.file_ext" />
                <mi-form-aux>不限格式请留空</mi-form-aux>
            </el-form-item>

            <el-form-item prop="image_size" label="上传图片大小">
                <mi-input-number v-model="edit.info.value.image_size" />
                <mi-form-aux>不限大小请填0</mi-form-aux>
            </el-form-item>

            <el-form-item prop="image_ext" label="上传图片格式">
                <mi-input v-model="edit.info.value.image_ext" />
                <mi-form-aux>不限格式请留空</mi-form-aux>
            </el-form-item>

            <el-form-item prop="video_size" label="上传视频大小">
                <mi-input-number v-model="edit.info.value.video_size" />
                <mi-form-aux>不限大小请填0</mi-form-aux>
            </el-form-item>

            <el-form-item prop="video_ext" label="上传视频格式">
                <mi-input v-model="edit.info.value.video_ext" />
                <mi-form-aux>不限格式请留空</mi-form-aux>
            </el-form-item>

        </el-form>
    </mi-form-page>
</template>

<script setup lang="ts">
import {reactive, watch, ref, onBeforeMount, inject, computed} from "vue";
import {makeModelAuth} from "@/utils/auth";
import {simpleGet, simplePost} from "@/utils/request";
import {FormInstance} from "element-plus";
import List from "@/model/list";
import Edit from "@/model/edit";

const url = '/site.siteConfig/edit'
const drivers = [
    {id:'local', title:'本地'}, {id:'qiniu', title:'七牛云'}, {id:'ali', title:'阿里云'},{id:'qcloud', title:'腾讯云'}
]

const rules = {
    type_id:[{required:true, message:'必填'}],
    title:[{required:true, message:'必填'}],
    image:[{required:true, message:'必填'}],
    status:[{required:true, message:'必填'}],
}

const loading = ref(false)
const formRef = ref<FormInstance>()
const parentOptions = ref<any[]>([])
const edit = inject('upload',new Edit({}))
edit.info = {
    value: {qiniu:{},ali:{},qcloud:{}}
}

const submit = () => {
    edit.submit({
        formRef: formRef.value,
        url: url,
    })
}

watch(() => edit.show, (nv,ov) => {
    edit.init(async () => {
        let {info} = await simpleGet(url, {key:'upload'})
        edit.info = info
    })
})

</script>

<style scoped>

</style>

